import React,{useState,useEffect} from "react";
import { Table } from 'antd';
import "./zhuangdan.css";
import Service from '../../../../service'


export default function NewAfterSales() {
  const columns = [
        {
            title: '序号',
            dataIndex: 'xh',
            width: 50,
          },
        {
          title: '客户名称',
          dataIndex: 'name',
          width: 80,
        //   render: (text) => <a href='/home/add_income'>{text}</a>,
        },
        {
          title: '手机号码',
          dataIndex: 'sjhm',
          width: 100,
        },
        {
          title: '部门',
          dataIndex: 'bm',
          width: 100,
        },
        {
            title: '业务员',
            dataIndex: 'ywy',
            width: 85,
          },
        {
          title: '提示',
          dataIndex: 'ts',
          width: 90,
        },
        {
          title: '录入时间',
          dataIndex: 'lrsj',
          width: 150,
        },
    
      ];
  //设置数据
  const [items, setItems] = useState([{
        id: 1,
        xh:1,
        name: '哈哈',
        sjhm: '12323443',
        bm: 3,
        ywy: '小三',
        ts: 500,
        lrsj: '2022-08-10  19:17',
      },
      {
        id: 2,
        xh:2,
        name: '小周',
        sjhm: '12323443',
        bm: 3,
        ywy: '小三',
        ts: 500,
        lrsj: '2022-08-10  19:17',
      },
      {
        id: 3,
        xh:3,
        name: '小羊',
        sjhm: '12323443',
        bm: 3,
        ywy: '小三',
        ts: 500,
        lrsj: '2022-08-10  19:17',
      },
      ])
  useEffect(()=>{
    console.log("进入了账单查询");
    zhuangSearch("1","10")
  },[])

   //头部右边搜索框
   const zhuangSearch = async (page,pageSize)=>{
    let result = await Service.cusManageAll.zhuangSearch(page,pageSize)
    console.log(result);
  } 

  return (
    <div id='zhuangdanchaxun_modal'>
        <div id="zhuangdan_biaoti">
            <div id="zhuangdan_mod">
                <ul>
                  <li style={{ display: "flex" }}>
                    <span className="inputTitle">客户名称</span>
                    <span>
                      <input type="text" placeholder="客户名称"/>
                    </span>
                  </li>
                  <li style={{ display: "flex" }}>
                    <span className="inputTitle">手机号码</span>
                    <span>
                      <input type="text" placeholder="手机号码"/>
                    </span>
                  </li>
                 </ul>
                <div id="Zhuangdan_annui">
                  <button>立即查询</button>
                </div>
                <div id='content'>
                    <Table columns={columns} rowKey={record => record.id} dataSource={items} pagination={{ defaultPageSize: 3 }} />
                </div>
            </div>
        </div>
    </div>
  );
}